import React, { useReducer, useEffect } from 'react'
import Header from '../../components/Headers/Headers'
import qs from 'querystring'
import GoodsInfo from './components/GoodsInfo'
import GoodsFooter from './components/GoodsFooter'
import { initState, reducer, actions, getGoodsInfo } from './reducer'
import { getInfo } from '../../request/api'
export default function Detail(props) {
    console.log(qs.parse(props.match.params.id).id);
    const [state, dispatch] = useReducer(reducer, initState)
    useEffect(() => {
        let id = qs.parse(props.match.params.id).id
        getInfo({ id }).then(res => {
            if(res.code === 200){
                dispatch(actions.changeGoodsInfo(res.list[0]))
            }
        })
    }, [])

    
    return (
        <div className="Detail_wrap">
            <Header title={getGoodsInfo(state).goodsname?getGoodsInfo(state).goodsname:"商品详情"} back={true} {...props}></Header>
            <GoodsInfo obj={getGoodsInfo(state)}></GoodsInfo>
            <GoodsFooter id={getGoodsInfo(state).id} {...props}></GoodsFooter>
        </div>
    )
}
